<!--#index.html-->
<!--head-->
<title>${article.title}</title>
<!--head end-->
<!--body#home.html#shell#body-->
<!--content-->
<script>
    $(function() {
        var s = $("content").text()
        $("content").text(s.replace("\n", "<br>"))

        $("#form").ajaxForm({
            success : function(data) {
                if(data.msg) {
                    $(".alert span").text(data.msg);
                    $(".alert").removeClass("alert-success").addClass("alert-error");
                    $(".alert").fadeOut("fast").fadeIn("fast")
                } else {
                    window.location.href = "/article/${article.id}?" + Math.random() + "#comments";
                }
            }
        })
        $(".alert button").click(function() {
            $(".alert").hide("fast")
        })
        $("a.delComment").click(function(e) {
            e.preventDefault();
            var a = this;
            $.post(a.href, {}, function(data) {
                if(data.msg) {
                    alert(data.msg)
                } else {
                    $(a).closest("li").remove();
                }
            }, "json")
        })
    })
</script>
<style>
    #content div.tags {
        margin: 5px 0;
    }
    #content div.tags a {
        margin: 0 5px;
    }
    .content {
        white-space: pre-wrap;
    }
    div.author, div.author a {
        color: gray;
        font-style: italic;
        font-size: larger;
        text-align: center;
    }
    div.date {
        text-align: right;
    }
    h3.title {
        text-align: center;
    }
    ul.status {
        text-align: right;
        color: gray;
    }
    ul.status li {
        display: inline-block;
        padding: 0 10px;
    }
    ul.status li.date {
        border-right: none;
    }
    #comments li {
        list-style: none;
        margin-bottom: 10px;
    }
    #comments li a {
        margin-right: 5px;
    }
    blockquote.content {
        padding: 5px;
        margin-bottom: 0;
    }
    .alert {
        margin-left: 0;
    }
</style>
<h3 class="title">${article.title}</h3>
<div class="author">
    <a href="/user/${user.id}" class="author">${user.name}</a>
    <br/>
    ${article.postDate.toLocaleString()}
</div>

<div class="tags">
    <strong>文章标签：</strong>
    <a href="/user/${user.id}/${#t}" w:t="article.tagList">${#t}</a>
</div>
<p class="content">
    ${article.content}
</p>
<ul class="status">
    <li><a href="/edit_article.html?article.id=${article.id}" w:="host">编辑</a></li>
    <li>浏览(${article.view})</li>
    <li><a href="#form" onclick="$('#form textarea').focus();return false">评论(${article.commentCount})</a></li>
    <li class="date">${article.postDate.toLocaleString()}</li>
</ul>
<hr/>
<ul id="comments">
    <li w:c="comments">
        <div>
            <a href="/user/${#c.author.id}">${#c.author.name}</a>：(${#c.postDate.toLocaleString()})
            <a href="/article.delComment?id=${#c.id}" w:="loginUser!=null && #c.author.id==loginUser.id" class="delComment">删除</a>
        </div>
        <blockquote class="content">${#c.content}</blockquote>
        <a w:t="rand(#c.author.tagList.keySet(), 10)" href="/user/${#c.author.id}/${#t}">${#t}</a>
    </li>
</ul>
<div class="pagination pagination-right">
    <ul>
        <li class="previous${pg==1?' disabled':''}">
            <a href="/article/${article.id}#comments">首页</a>
        </li>
        <li class="previous${pg<=1?' disabled':''}">
            <a href="/article/${article.id}/${pg-1}#comments">«</a>
        </li>
        <li w:p="pgs" class="${pg==#p?'active':null}">
            <a href="/article/${article.id}/${#p}#comments">${#p}</a>
        </li>
        <li class="previous${pg>=pageCount?' disabled':''}">
            <a href="/article/${article.id}/${pg+1}#comments">»</a>
        </li>
        <li class="previous${pg==pageCount?' disabled':''}">
            <a href="/article/${article.id}/${pageCount}#comments">末页</a>
        </li>
    </ul>
</div>
<div w:="loginUser">
    <div class="alert alert-error">
        <button type="button" class="close">×</button>
        <span></span>
    </div>
    <form action="/article.addComment" method="post" id="form">
        <input type="hidden" name="article.id" value="${article.id}"/>
        <textarea rows="5" placeholder="评论..." class="input-xxlarge" name="comment"></textarea>
        <br/>
        <button type="submit" class="btn btn-primary">评论</button>
    </form>
</div>
<!--content end-->
<!--body#home.html#shell#body end-->
<!--#index.html end-->